<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<!-- JavaScript includes - jQuery and our own script.js -->
<script src="${initParam.root }/jquery-1.8.3.js"></script>
<script src="${initParam.root }/scripts/recipe/script.js"></script>
<script type="text/javascript">
 $(document).ready(function(){
  $(".listTxt").hide();
  $(".listImg").hover(function(){
	  $(this).find(".fp").css("zIndex","1");
	  $(this).children(".listTxt").show();
	  $(this).find(".fp").stop().animate({ opacity: 0.7 }, 200);
	  
  },
  function(){
	$(this).find(".fp").css("zIndex","7");
   $(this).children(".listTxt").hide();
   $(this).find(".fp").stop().animate({ opacity: 1.0 }, 200);
  });

 });
</script>
<meta charset="utf-8" />
<title>뽐내기 게시판</title>

<!-- The stylesheet -->
<link rel="stylesheet" href="${initParam.root}/css/bbom_styles.css" />
<!-- Google Fonts -->
<!--  <link rel="stylesheet" href="http://fonts.googleapis.com/css?family=Rochester|Bree+Serif" /> -->

<header>
	<h2>
		<img src="${initParam.root }/img/bbom&search/main-bbom-main.gif"
			alt="RapidXHTML" />
	</h2>
</header>

<div id="main">
		<ul id="carousel">
			<c:forEach items="${requestScope.userListByRecipe.list }" var="list"
	 		varStatus="i">
			<c:if test="${i.count>=1 and i.count<=5 }">
					<li class="visible">
					<div class="listImg" align="center">
					<span class="listTxt" onclick="parent.location='recipe.do?command=getContent&r_no=${list.R_NO }&m_id=${list.M_ID }&page=1'" style="cursor: pointer;">
					${list.R_DATE }<br>
					조회수 : ${list.R_CNT }<br>
					평점 : <br>
						<c:choose>
						<c:when test="${list.R_GCNT>0 }">
							<c:if test="${list.R_TOTALGRADE div list.R_GCNT >4.5}">
							 <img alt="grade" src="${initParam.root }/img/bbom&search/main-grade-5.png">
      						</c:if>
							<c:if test="${list.R_TOTALGRADE div list.R_GCNT >=4.5 and list.R_TOTALGRADE div list.R_GCNT<5}">
									 <img alt="grade" src="${initParam.root }/img/bbom&search/main-grade-4.5.png">
      						</c:if>
      							<c:if test="${list.R_TOTALGRADE div list.R_GCNT >=4 and list.R_TOTALGRADE div list.R_GCNT<4.5}">
									 <img alt="grade" src="${initParam.root }/img/bbom&search/main-grade-4.png">
      						</c:if>
      						<c:if test="${list.R_TOTALGRADE div list.R_GCNT >=3.5 and list.R_TOTALGRADE div list.R_GCNT<4}">
      							<img alt="grade" src="${initParam.root }/img/bbom&search/main-grade-3.5.png">${list.R_TOTALGRADE div list.R_GCNT}
      						</c:if>
      							<c:if test="${list.R_TOTALGRADE div list.R_GCNT >=3 and list.R_TOTALGRADE div list.R_GCNT<3.5}">
      							<img alt="grade" src="${initParam.root }/img/bbom&search/main-grade-3.png">${list.R_TOTALGRADE div list.R_GCNT}
      						</c:if>
      							<c:if test="${list.R_TOTALGRADE div list.R_GCNT >=2.5 and list.R_TOTALGRADE div list.R_GCNT<3}">
      							<img alt="grade" src="${initParam.root }/img/bbom&search/main-grade-2.5.png">${list.R_TOTALGRADE div list.R_GCNT}
      						</c:if>
      							<c:if test="${list.R_TOTALGRADE div list.R_GCNT >=2 and list.R_TOTALGRADE div list.R_GCNT<2.5}">
      							<img alt="grade" src="${initParam.root }/img/bbom&search/main-grade-2.png">${list.R_TOTALGRADE div list.R_GCNT}
      						</c:if>
      						<c:if test="${list.R_TOTALGRADE div list.R_GCNT >=1.5 and list.R_TOTALGRADE div list.R_GCNT<2}">
      							<img alt="grade" src="${initParam.root }/img/bbom&search/main-grade-1.5.png">
      						</c:if>
      						<c:if test="${list.R_TOTALGRADE div list.R_GCNT >=1 and list.R_TOTALGRADE div list.R_GCNT<1.5}">
      							<img alt="grade" src="${initParam.root }/img/bbom&search/main-grade-1.png">
      						</c:if>
      						<c:if test="${list.R_TOTALGRADE div list.R_GCNT >=0.5 and list.R_TOTALGRADE div list.R_GCNT<1}">
      							<img alt="grade" src="${initParam.root }/img/bbom&search/main-grade-1.png">
      						</c:if>
      						<c:if test="${list.R_TOTALGRADE div list.R_GCNT >0 and list.R_TOTALGRADE div list.R_GCNT<0.5}">
      							<img alt="grade" src="${initParam.root }/img/bbom&search/main-grade-0.5.png">
      						</c:if>
      						</c:when>
							<c:otherwise>
								평가해주세요!
							</c:otherwise>
							</c:choose>
					</span>
					
					<a href="recipe.do?command=getContent&r_no=${list.R_NO }&m_id=${list.M_ID }&page=1"><img class="fp"
       				src="${initParam.imgRoot }${list.R_IMG_NEW }" alt="RapidXHTML"/></a></div><img
      				alt="title"
      				src="${initParam.root }/img/bbom&search/main-bbom-title.gif">
      				<span class="ListTitle">${list.R_TITLE }</span><br> <img alt="writer"
      				src="${initParam.root }/img/bbom&search/main-bbom-hat.jpg">
      				<span class="ListWriter">${list.R_WRITER }</span></li>
			</c:if>
	</c:forEach>
	</ul>
	<ul id="carousel1">
		<c:forEach items="${requestScope.userListByRecipe.list }" var="list"	varStatus="i">
			<c:if test="${i.count>=6 and i.count<=10 }">
					<li class="visible">
					<div class="listImg" align="center">
					<span class="listTxt" onclick="parent.location='recipe.do?command=getContent&r_no=${list.R_NO }&m_id=${list.M_ID }&page=1'" style="cursor: pointer;">
					${list.R_DATE }<br>
					조회수 : ${list.R_CNT }<br>
					평점 : <br>
						<c:choose>
						<c:when test="${list.R_GCNT>0 }">
							<c:if test="${list.R_TOTALGRADE div list.R_GCNT >4.5}">
							 <img alt="grade" src="${initParam.root }/img/bbom&search/main-grade-5.png">${list.R_TOTALGRADE div list.R_GCNT}
      						</c:if>
							<c:if test="${list.R_TOTALGRADE div list.R_GCNT >=4.5 and list.R_TOTALGRADE div list.R_GCNT<5}">
									 <img alt="grade" src="${initParam.root }/img/bbom&search/main-grade-4.5.png">${list.R_TOTALGRADE div list.R_GCNT}
      						</c:if>
      							<c:if test="${list.R_TOTALGRADE div list.R_GCNT >=4 and list.R_TOTALGRADE div list.R_GCNT<4.5}">
									 <img alt="grade" src="${initParam.root }/img/bbom&search/main-grade-4.png">${list.R_TOTALGRADE div list.R_GCNT}
      						</c:if>
      						<c:if test="${list.R_TOTALGRADE div list.R_GCNT >=3.5 and list.R_TOTALGRADE div list.R_GCNT<4}">
      							<img alt="grade" src="${initParam.root }/img/bbom&search/main-grade-3.5.png">${list.R_TOTALGRADE div list.R_GCNT}
      						</c:if>
      							<c:if test="${list.R_TOTALGRADE div list.R_GCNT >=3 and list.R_TOTALGRADE div list.R_GCNT<3.5}">
      							<img alt="grade" src="${initParam.root }/img/bbom&search/main-grade-3.png">${list.R_TOTALGRADE div list.R_GCNT}
      						</c:if>
      							<c:if test="${list.R_TOTALGRADE div list.R_GCNT >=2.5 and list.R_TOTALGRADE div list.R_GCNT<3}">
      							<img alt="grade" src="${initParam.root }/img/bbom&search/main-grade-2.5.png">${list.R_TOTALGRADE div list.R_GCNT}
      						</c:if>
      							<c:if test="${list.R_TOTALGRADE div list.R_GCNT >=2 and list.R_TOTALGRADE div list.R_GCNT<2.5}">
      							<img alt="grade" src="${initParam.root }/img/bbom&search/main-grade-2.png">${list.R_TOTALGRADE div list.R_GCNT}
      						</c:if>
      						<c:if test="${list.R_TOTALGRADE div list.R_GCNT >=1.5 and list.R_TOTALGRADE div list.R_GCNT<2}">
      							<img alt="grade" src="${initParam.root }/img/bbom&search/main-grade-1.5.png">${list.R_TOTALGRADE div list.R_GCNT}
      						</c:if>
      						<c:if test="${list.R_TOTALGRADE div list.R_GCNT >=1 and list.R_TOTALGRADE div list.R_GCNT<1.5}">
      							<img alt="grade" src="${initParam.root }/img/bbom&search/main-grade-1.png">${list.R_TOTALGRADE div list.R_GCNT}
      						</c:if>
      						<c:if test="${list.R_TOTALGRADE div list.R_GCNT >=0.5 and list.R_TOTALGRADE div list.R_GCNT<1}">
      							<img alt="grade" src="${initParam.root }/img/bbom&search/main-grade-1.png">${list.R_TOTALGRADE div list.R_GCNT}
      						</c:if>
      						<c:if test="${list.R_TOTALGRADE div list.R_GCNT >0 and list.R_TOTALGRADE div list.R_GCNT<0.5}">
      							<img alt="grade" src="${initParam.root }/img/bbom&search/main-grade-0.5.png">${list.R_TOTALGRADE div list.R_GCNT}
      						</c:if>
      						</c:when>
							<c:otherwise>
								평가해주세요!
								<img alt="grade" src="${initParam.root }/img/bbom&search/main-grade-0.png"> 0
							</c:otherwise>
							</c:choose>
						</span>
					<a href="recipe.do?command=getContent&r_no=${list.R_NO }&m_id=${list.M_ID }&page=1"  ><img class="fp"
							src="${initParam.imgRoot }${list.R_IMG_NEW }" alt="RapidXHTML" /></div></a><img
						alt="title"
						src="${initParam.root }/img/bbom&search/main-bbom-title.gif">
						<span class="ListTitle">${list.R_TITLE }</span><br> <img alt="writer"
						src="${initParam.root }/img/bbom&search/main-bbom-hat.jpg">
						<span class="ListWriter">${list.R_WRITER }</span></li>
			</c:if>
		</c:forEach>
	</ul>

	<ul id="carousel2">
		<c:forEach items="${requestScope.userListByRecipe.list }" var="list" varStatus="i">
			<c:if test="${i.count>=11 and i.count<=15 }">
				<li class="visible">
					<div class="listImg" align="center">
					<span class="listTxt" onclick="parent.location='recipe.do?command=getContent&r_no=${list.R_NO }&m_id=${list.M_ID }&page=1'" style="cursor: pointer;">
					${list.R_DATE }<br>
					조회수 : ${list.R_CNT }<br>
					평점 :<br>
					<c:choose>
						<c:when test="${list.R_GCNT>0 }">
							<c:if test="${list.R_TOTALGRADE div list.R_GCNT >4.5}">
							 <img alt="grade" src="${initParam.root }/img/bbom&search/main-grade-5.png">${list.R_TOTALGRADE div list.R_GCNT}
      						</c:if>
							<c:if test="${list.R_TOTALGRADE div list.R_GCNT >=4.5 and list.R_TOTALGRADE div list.R_GCNT<5}">
									 <img alt="grade" src="${initParam.root }/img/bbom&search/main-grade-4.5.png">${list.R_TOTALGRADE div list.R_GCNT}
      						</c:if>
      							<c:if test="${list.R_TOTALGRADE div list.R_GCNT >=4 and list.R_TOTALGRADE div list.R_GCNT<4.5}">
									 <img alt="grade" src="${initParam.root }/img/bbom&search/main-grade-4.png">${list.R_TOTALGRADE div list.R_GCNT}
      						</c:if>
      						<c:if test="${list.R_TOTALGRADE div list.R_GCNT >=3.5 and list.R_TOTALGRADE div list.R_GCNT<4}">
      							<img alt="grade" src="${initParam.root }/img/bbom&search/main-grade-3.5.png">${list.R_TOTALGRADE div list.R_GCNT}
      						</c:if>
      							<c:if test="${list.R_TOTALGRADE div list.R_GCNT >=3 and list.R_TOTALGRADE div list.R_GCNT<3.5}">
      							<img alt="grade" src="${initParam.root }/img/bbom&search/main-grade-3.png">${list.R_TOTALGRADE div list.R_GCNT}
      						</c:if>
      							<c:if test="${list.R_TOTALGRADE div list.R_GCNT >=2.5 and list.R_TOTALGRADE div list.R_GCNT<3}">
      							<img alt="grade" src="${initParam.root }/img/bbom&search/main-grade-2.5.png">${list.R_TOTALGRADE div list.R_GCNT}
      						</c:if>
      							<c:if test="${list.R_TOTALGRADE div list.R_GCNT >=2 and list.R_TOTALGRADE div list.R_GCNT<2.5}">
      							<img alt="grade" src="${initParam.root }/img/bbom&search/main-grade-2.png">${list.R_TOTALGRADE div list.R_GCNT}
      						</c:if>
      						<c:if test="${list.R_TOTALGRADE div list.R_GCNT >=1.5 and list.R_TOTALGRADE div list.R_GCNT<2}">
      							<img alt="grade" src="${initParam.root }/img/bbom&search/main-grade-1.5.png">${list.R_TOTALGRADE div list.R_GCNT}
      						</c:if>
      						<c:if test="${list.R_TOTALGRADE div list.R_GCNT >=1 and list.R_TOTALGRADE div list.R_GCNT<1.5}">
      							<img alt="grade" src="${initParam.root }/img/bbom&search/main-grade-1.png">${list.R_TOTALGRADE div list.R_GCNT}
      						</c:if>
      						<c:if test="${list.R_TOTALGRADE div list.R_GCNT >=0.5 and list.R_TOTALGRADE div list.R_GCNT<1}">
      							<img alt="grade" src="${initParam.root }/img/bbom&search/main-grade-1.png">${list.R_TOTALGRADE div list.R_GCNT}
      						</c:if>
      						<c:if test="${list.R_TOTALGRADE div list.R_GCNT >0 and list.R_TOTALGRADE div list.R_GCNT<0.5}">
      							<img alt="grade" src="${initParam.root }/img/bbom&search/main-grade-0.5.png">${list.R_TOTALGRADE div list.R_GCNT}
      						</c:if>
      						</c:when>
							<c:otherwise>
								평가해주세요!
								<img alt="grade" src="${initParam.root }/img/bbom&search/main-grade-0.png"> 0
							</c:otherwise>
							</c:choose>
					</span>
					<a href="recipe.do?command=getContent&r_no=${list.R_NO }&m_id=${list.M_ID }&page=1"><img class="fp"
							src="${initParam.imgRoot }${list.R_IMG_NEW }" alt="RapidXHTML" /></div></a><img
						alt="title"
						src="${initParam.root }/img/bbom&search/main-bbom-title.gif">
						<span class="ListTitle">${list.R_TITLE }</span><br> <img alt="writer"
						src="${initParam.root }/img/bbom&search/main-bbom-hat.jpg">
						<span class="ListWriter">${list.R_WRITER }</span></li>
			</c:if>
		</c:forEach>
	</ul>
</div>

<div id="paging">


	<c:if test="${requestScope.userListByRecipe.pagingBean.previousPageGroup }">
		<a	href="${initParam.root }/recipe.do?command=bbomListBySearchWord&pageNo=${requestScope.userListByRecipe.pagingBean.startPageOfPageGroup-1}&s_txt=${requestScope.userListByRecipe.map.word}&s_type=${requestScope.userListByRecipe.map.s_type}&s_order=${requestScope.userListByRecipe.map.s_order}&r_type=${requestScope.userListByRecipe.map.r_type}"">
			<img src="${initParam.root }/img/paging/left_arrow_btn.gif">
		</a>
	</c:if>
	<c:forEach var="i"	begin="${requestScope.userListByRecipe.pagingBean.startPageOfPageGroup}" end="${requestScope.userListByRecipe.pagingBean.endPageOfPageGroup}">
		<c:choose>
			<c:when test="${requestScope.userListByRecipe.pagingBean.nowPage!=i}">
				<a href="${initParam.root }/recipe.do?command=bbomListBySearchWord&pageNo=${i}&s_txt=${requestScope.userListByRecipe.map.word}&s_type=${requestScope.userListByRecipe.map.s_type}&s_order=${requestScope.userListByRecipe.map.s_order}&r_type=${requestScope.userListByRecipe.map.r_type}"">${i}</a>
			</c:when>
			<c:otherwise>
	${i}
	</c:otherwise>
		</c:choose>
	</c:forEach>
	<c:if test="${requestScope.userListByRecipe.pagingBean.nextPageGroup}">
		<a
			href="${initParam.root }/recipe.do?command=bbomListBySearchWord&pageNo=${requestScope.userListByRecipe.pagingBean.endPageOfPageGroup+1}&s_txt=${requestScope.userListByRecipe.map.word}&s_type=${requestScope.userListByRecipe.map.s_type}&s_order=${requestScope.userListByRecipe.map.s_order}&r_type=${requestScope.userListByRecipe.map.r_type}">
			<img src="${initParam.root }/img/paging/right_arrow_btn.gif">
		</a>
	</c:if>
</div>





